<template>
  <el-form ref="form">
    <div style="float: left;font-size: 18px;width: 100%;text-align: left;margin-bottom: 15px;">层级</div>
    <el-form-item>
      <div v-for="(item,index) in form" style="width: 100%;text-align: left;margin-left: 50px;">
        <el-input v-model="item.layer" placeholder="单行输入" style="width:15%;margin-right: 10px;"></el-input>
        <el-button type="primary"  v-if="index==0" style="margin-left:20px;" @click="addOne()">添 加</el-button>
        <el-button type="danger"   v-else style="margin-left:20px;" @click="delOne(index)">删 除</el-button>
        <div style="width: 100%;height:10px;margin-bottom:20px"></div>
      </div>

    </el-form-item>

    <el-divider></el-divider>

    <el-form-item>
      <el-button type="primary" @click="onSubmit">提交</el-button>
    </el-form-item>

  </el-form>
</template>

<script>
import { EventBus } 																		from 	"bus/mybus.js";
import {getCJData,doCjUpdate} from "../../crm/system/custom";

export default {
  name: "CustomCj",
  data(){
    return {
      form: {},
    }
  },
  created(){
    this.getRequestData()
  },

  methods:{
    getRequestData(){
      const payload        = {}
      payload.operatorId   = this.$store.state.operatorId
      getCJData(payload).then(res=>{
        this.form = res.layers
      }).catch(err=>{
        EventBus.$emit('closeloading')
      })
    },

    //新增管理区域..
    addOne(){
      this.form.push({})
    },
    //删除管理区域..
    delOne(index){
      this.form.splice(index,1)
    },

    //提交
    onSubmit() {

      this.$confirm('确认提交操作??', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        const payload       = {}
        payload.operatorId  = this.$store.state.operatorId
        payload.layers        = this.form

        doCjUpdate(payload).then(res=>{
          this.$message.success('操作成功')
        }).catch(err=>{
          EventBus.$emit('closeloading')
        })
      }).catch(() => {});

    },

  },


}
</script>

<style scoped>
.el-select:hover .el-input__inner {
  border-color: #C0C4CC;
}
</style>